<?php $this->headLink()->appendStylesheet($this->websiteUrl . 'system/css/seotoaster.css'); ?>
<?php $this->headLink()->appendStylesheet($this->websiteUrl .'system/js/thickbox/thickbox.css'); ?>
<?php echo $this->headLink(); ?>
<?php $this->headScript()->appendFile($this->websiteUrl . 'system/js/jquery/jquery.js'); ?>
<?php $this->headScript()->appendFile($this->websiteUrl .'system/js/jquery/plugins/dragndrop/jquicustommin.js'); ?>
<?php $this->headScript()->appendFile($this->websiteUrl . 'system/js/thickbox/thickbox.js'); ?>
<?php $this->headScript()->appendFile($this->websiteUrl . 'system/js/featuredarea/featuredarea.js'); ?>
<?php echo $this->headScript(); ?>
<div id="admineditwhat">{%Featured Areas%}</div>
<!-- <div class="close_window" onclick="backToPage();"></div> -->
<?php echo $this->form; ?>

 <div id="fa-errors" class="errors"  style="display:none;cursor:pointer;" onclick="hideFaMessages();">
    <ul>
    <li id="fa-exists" style="display:none;"><strong>Featured area with such a name already exists.</strong></li>
    <li id="fa-lenght" style="display:none;"><strong>Featured area name must be less then 250 characters.</strong></li>
    <li id="fa-empty" style="display:none;"><strong>Featured area name can not be empty.</strong></li>
</ul>
 </div>

 <div id="fa-success" class="success"  style="display:none;cursor:pointer;" onclick="hideFaMessages();">
   <ul>
   <li id="add-success" style="display:none;"><strong>Featured area was added.</strong></li>
    <li id="delete-success" style="display:none;"><strong>Featured area was deleted.</strong></li>
</ul>
 </div>

<div id="featuredlist-headers">
<table id="featured-table" border="0" cellspacing="0">
    <th style="width:200px;">{%Area%}</th>
    <th style="width:190px;"># {%Featured Pages%}</th>
    <th style="width:80px;">{%Select%}</th>
    <th style="width:80px;text-align:center;">{%Del%}</th>
    <th style="width:80px;text-align:center;">{%Order%}</th>
</table>
</div>

<div id="featuredlist" style="height:300px;overflow-y:auto;">
<table id="featured-table-list" border="0" cellspacing="0">
<?php if(isset($this->featuredAreasArray) && is_array($this->featuredAreasArray) && !empty($this->featuredAreasArray)): ?>
<?php foreach ($this->featuredAreasArray as $featuredArea): ?>
    <tr id="featuredarea_<?php echo $featuredArea['id']; ?>">
        <td align="left" style="width:230px;font-weight:bold;text-indent:10px;"><span title="<?php echo $featuredArea['name']; ?>"><?php echo (strlen($featuredArea['name']) < 30 ? $featuredArea['name'] : substr($featuredArea['name'],0,30).'...'); ?></span></td>
        <td align="left"  style="width:110px;text-indent:10px;"><?php echo $featuredArea['pages'];?></td>
        <td align="left" style="width:80px;text-align:center;">
            <input type="checkbox" name="facheck-<?php echo $featuredArea['id']; ?>" id="facheck-<?php echo $featuredArea['id']; ?>" value="<?php echo $featuredArea['id']; ?>" onclick="selectFeaturedArea('<?php echo $featuredArea['id']; ?>',this.checked);" />
        </td>
        <td align="center" style="width:80px;">
            <img style="cursor:pointer;" alt="ico-delete" title="Delete this featured area." src="<?php echo $this->websiteUrl; ?>system/images/ico_delete.gif" onclick="deletefeaturedarea('<?php echo $this->websiteUrl; ?>', '<?php echo $featuredArea['id']; ?>');"/>
        </td>
        <td align="center" style="width:80px;"><a href="#" title="Order" style="color:#000;" onclick="orderFeaturedArea(<?php echo $featuredArea['id']; ?>,'<?php echo $featuredArea['name']; ?>'); return false;">Order</a></td>
    </tr>
<?php endforeach; ?>
<?php endif; ?>
</table>
	<input type="hidden" id="hid-main-wsurl" name="hid-main-wsurl" value="<?php echo $this->websiteUrl; ?>" />
</div>

<div id="fa-order"></div>

<script type="text/javascript">
    $(document).ready(function() {
		$("#featured_name").keypress(function (e) {
        if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {
			addf();
            return false;
        }
    });
	})
    
	var str = $("#featured_ids").val();
    var splitted=str.split(":");
    for(i=0; i<splitted.length-1; i++) {
        if(parseInt(splitted[i])) {
            $('#facheck-'+splitted[i]).attr('checked',true);
        }
    }
</script>